<template>
    <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item
                v-for="(dir,index) in historyDir"
                :key="index">
            <span class="breadcrumb" @click="jumpTo(dir)">{{dir.name}}</span>
        </el-breadcrumb-item>
    </el-breadcrumb>
</template>

<script>
    /**
     * 文件列表上方的目录层级
     */
    export default {
        name: "DirectoryBreadcrumb",
        props:{
            historyDir:{
                type: Array,
                default: []
            }
        },
        methods:{
            jumpTo(dir){
                this.$emit('jump-to', dir);
            }
        }
    }
</script>

<style scoped>
    .breadcrumb{
        cursor: pointer;
    }
    .breadcrumb:hover{
        color: #409EFF;
    }
</style>